<template>
  <div>
    <!-- 全部商品分类 -->
    <TypeNav></TypeNav>
    <!-- 轮播与尚品汇快报 -->
    <ListContainer></ListContainer>
    <!-- 今日推荐 -->
    <Recommend></Recommend>
    <!-- 排行 -->
    <Rank></Rank>
    <!-- 喜欢 -->
    <Like></Like>

    <!-- 楼层 （使用两次） -->
    <!-- <Floor></Floor>
    <Floor></Floor> -->

    <!--  
       Floor标签,通过v-for动态生成
       父子组件通信:props

       问题:VC[Home]身上的floorList这个属性的属性值有几种情况?

       仓库floorList:起始值 空数组
       仓库floorList:不是空数组,代表服务器数据回来了。v-for渲染子组件完毕。给组件的props,就是两个对象
       
   -->

   <Floor v-for="(floor,index) in floorList" :key="floor.id" :floor="floor"></Floor>




    <!-- 商标 -->
    <Brand></Brand>
  </div>
</template>

<script>
// 局部组件  引入，注册，使用
import ListContainer from "./listContainer";
import Recommend from "./recommend";
import Rank from "./rank";
import Like from "./like";
import Floor from "./floor";
import Brand from "./brand";


import {mapState} from 'vuex'

export default {
  name: "Home",
  components: {
    ListContainer,
    Recommend,
    Rank,
    Like,
    Floor,
    Brand,
  },
  // /Home路由组件,组件挂载完毕执行一次
  mounted() {
    // 派发actions
    this.$store.dispatch("getFloorList");


   

  },

  computed:{
    ...mapState({
      floorList : (state)=>state.home.floorList,
    })
  }
};
</script>

<style scoped>
</style>